<script setup lang="ts">
import { ref } from 'vue'
import HmSon from './components/HmSon.vue'
/*
  ref获取组件实例
  1：const xxx=ref<InstanceType<typeof 导入子组件>>(null)
  2:  <子组件  ref='xxx'  />
  3:  xxx.value

实际开发：
  自己定义的组件：使用上面刚讲的方法即可InstanceType<typeof 导入子组件>
  使用ui库内的组件：比如van-form,找官方文档找到相应类型
  使用的外部组件，但找不到相应类型：any
*/
const xxx = ref<InstanceType<typeof HmSon>>()
// const xxx = ref()
const btnClick = () => {
  console.log(xxx.value?.num)
  xxx.value?.validate()
}
</script>

<template>
  <div class="play-page">play</div>
  <hr />
  <HmSon ref="xxx"></HmSon>
  <hr />
  <button @click="btnClick">获取hmson实例，并调用它内部的一个方法</button>
</template>

<style lang="scss" scoped></style>
